import { PlusSquareOutlined, EllipsisOutlined, EditOutlined, DeleteOutlined } from '@ant-design/icons';
import { Dropdown, Button } from 'antd';

// 封装新建模块
export const useActionTableColumn = (handleMenuClick) => {
    return{
        get title() { return (<div style={{ textAlign: 'center' }}><PlusSquareOutlined /></div>) },
        dataIndex: 'id',
        key: 'id',
        width: 100,
        render: (text, record) => {
            const menuItems = [
                {
                    label: <span style={{ color: '#1677ff' }}>编辑</span>,
                    key: 'edit',
                    onClick: () => handleMenuClick('edit', record)
                },
                {
                    label: <span style={{ color: '#ff4d4f' }}>删除</span>,
                    key: 'delete',
                    onClick: () => handleMenuClick('delete', record)
                }
            ]
            return (
                <div
                    style={{ textAlign: 'center' }}
                    onClick={(e) => e.stopPropagation()}
                >
                    <Dropdown
                        menu={{ items: menuItems }}
                        trigger={['click']}
                        overlayStyle={{
                            width: '60px',
                        }}
                    >
                        <Button
                            icon={<EllipsisOutlined />}
                            size="big"
                            style={{ border: 'none' }}
                        />
                    </Dropdown>
                </div>
            );
        }
    }
}